<template>
  <div>
    <goods-swiper :swipperList="swipperList"></goods-swiper>
    <goods-footer v-if="middleList.length" :footerList="footerList" :middle-list="middleList"></goods-footer>
    <goods-middle :middleList="middleList"></goods-middle>
  </div>
</template>

<script>
    import GoodsSwiper from "./components/GoodsSwiper";
    import GoodsFooter from "./components/GoodsFooter";
    import GoodsMiddle from "./components/GoodsMiddle";
    import axios from 'axios'
    export default {
        name: "GoodsDatail",
      components: {
        GoodsMiddle,
          GoodsSwiper,
          GoodsFooter
        },
      props:['id'],
      methods:{
          test(){
            console.log(this.id)

          },
        getDetailData(){
            axios.get('/static/data/goods/goods' + this.id + '.json').then(this.getDetailDataSucc)
        },
        getDetailDataSucc(res){
            res = res.data
          if (res.ret && res.data){
            var data = res.data
            this.swipperList=data.swipperList
            this.middleList=data.middleList
            this.footerList=data.footerList
          }
        }
      },
      data(){
          return{
            swipperList:[],
            middleList:[],
            footerList:[]

          }

      },
      mounted() {
          this.getDetailData()
      },
      created() {
          this.test()
      }
    }
</script>

<style scoped>

</style>
